<template>
	<view  class="content">
		<!-- 标题 -->
		<!-- <view class="title">文化</view> -->
		
		<!-- 定位搜索栏 -->
		<view class="chom1">
			<view>
				定位
			</view>
			<view class="search"><image src="../home/img/Search.png" /><input placeholder="搜索栏"/></view>
		</view>
		
		<!-- 四级联动 -->
		<view class="chom2">
		</view>
		
		<!-- 相关内容展示 -->
		<view class="deom6bj">
				<view class="deom6_title">热点咨询</view>
				<view class="deom6_whole">
					<navigator>
						<view>
							<view class="deom6_count">景点假期攻略来啦！景点假期攻略 来啦！景点假期攻略来啦！</view>
							<view class="deom6_time"><view>贵州政府</view><view>2021/5/10</view></view>
						</view>
						<image src="../home/img/5.jpg"/>
					</navigator>
					<!-- 阴影 -->
					<view class="yinying"> </view>
					
					<navigator>
						<view>
							<view class="deom6_count">xxxxxxxxxxxxxxxxxxxxxxxx</view>
							<view class="deom6_time"><view>今日热点</view><view>2021-5-10</view></view>
						</view>
						<image src="../home/img/5.jpg"/>
					</navigator>
					<!-- 阴影 -->
					<view class="yinying"> </view>
					
					<navigator>
						<view>
							<view class="deom6_count">xxxxxxxxxxxxxxxxxxxxxxxx</view>
							<view class="deom6_time"><view>今日热点</view><view>2021-5-10</view></view>
						</view>
						<image src="../home/img/5.jpg"/>
					</navigator>
					<!-- 阴影 -->
					<view class="yinying"> </view>
					
					
					<navigator>
						<view>
							<view class="deom6_count">xxxxxxxxxxxxxxxxxxxxxxxx</view>
							<view class="deom6_time"><view>今日热点</view><view>2021-5-10</view></view>
						</view>
						<image src="../home/img/5.jpg"/>
					</navigator>
					<!-- 阴影 -->
					<view class="yinying"> </view>
				</view>
			
		</view>    		
	</view>
</template>

<script>
</script>

<style>
	/* 定位搜索栏 */
	.chom1{
		height: 30px;
		display: flex;
		justify-content: space-around;
		align-items: center;
		
	}
	.search{
		position: relative;
	}
	.search image{
		width: 13px;
		height: 15px;
		position: relative;
		top:-2px ;
		left: 15px;
		z-index: 10;
	}
	.search input{
		width: 225px;
		height: 25px;
		background: #70a0eb;
		border-radius:15px ;
		display: inline-block;
		position: relative;
		top:2px;
		left: -8px;
		padding-left: 30px;
	}
	
	
	
	/* 相关内容展示 */
	/*热点咨询*/
	.deom6bj{
		width: 100%;
		background: linear-gradient(#f2f2f2, #ffffff);
	}
	.deom6_title{
		padding: 20px 0px 10px 0px;
		padding-top: 10px;
		font-size: 19px;
		color: #333333;
		width: 90%;
		margin: 0 auto;
	}
	.deom6_whole{
		width: 100%;
		background-color: #dae4e0;
		padding: 10px 0px 0px 0px;
	}
	.deom6_whole>navigator{
		width: 90%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		margin-bottom: 25px;
		height: 70px;
	}
	.deom6_whole>navigator>view{
		width: 55%;
		display: flex;
		align-content:space-between;
		flex-wrap: wrap;
	}
	.deom6_whole>navigator image{
		width: 30%;
		height: 70px;
	}
	.deom6_whole .deom6_time{
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items:center;
	}
	 .deom6_whole .deom6_time view{
		color: #A4A4A4;
		font-size: 8px;
	}
	
	.deom6 .deom6_whole .deom6_count{
		display: -webkit-box;
		overflow: hidden;
		text-overflow: ellipsis;
		word-wrap: break-word;
		white-space: normal !important;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		font-size: 14px;
		color: #161616;
	}
	.yinying{
		width: 100%;
		height: 2px;
		background-color: #161616;
		margin-bottom: 5px;
	}
</style>
